<script setup lang="ts">
import { PAGINATIONFOOT } from "@/utils/staticData";
import router from "@/router";
import { getDictList } from "@/api/dict";
import { ref } from "vue";
defineOptions({ name: "manageTable" });

defineProps({
  tableHeight: { default: 0, type: Number },
  tableData: { type: Array, default: () => [] },
  pagination: { type: Object, default: () => {} },
  inboundTypeList: { type: Array, default: () => [] }
});
const warehouseTypeList = ref([]);
const handleDetail = (row: any) => {
  router.push({
    path: "/inventory/inboundPage",
    query: { id: row.id }
  });
};

const handleEdit = (row: any) => {
  router.push({
    path: "/inventory/inboundEditDetail",
    query: { id: row.id }
  });
};

const getWarehouseTypeList = () => {
  getDictList({ dictCode: "WAREHOUSE_TYPE" }).then(res => {
    warehouseTypeList.value = res.data || [];
  });
};
getWarehouseTypeList();
</script>

<template>
  <el-table
    :data="tableData"
    class="tableBox"
    style="width: 100%"
    :height="
      tableHeight - (pagination.total > pagination.size ? PAGINATIONFOOT : 0)
    "
  >
    <el-table-column type="index" label="序号" min-width="88px" />
    <el-table-column
      prop="inboundCode"
      label="入库单据编号"
      min-width="184px"
      show-overflow-tooltip
    />
    <el-table-column
      prop="inboundType"
      label="入库类型"
      min-width="136px"
      show-overflow-tooltip
    >
      <template #default="{ row }">
        {{
          inboundTypeList.find(item => item.dictLabelValue == row.inboundType)
            ?.dictLabelName
        }}
      </template>
    </el-table-column>
    <el-table-column
      prop="warehouseName"
      label="入库仓库名称"
      min-width="152px"
      show-overflow-tooltip
    />
    <el-table-column
      prop="warehouseType"
      label="入库仓库类型"
      min-width="146px"
      show-overflow-tooltip
    >
      <template #default="{ row }">
        {{
          warehouseTypeList.find(item => item.dictLabelValue == row.warehouseType)
            ?.dictLabelName
        }}
      </template>
    </el-table-column>
    <el-table-column
      prop="relateOrderCode"
      label="入库关联单据号"
      min-width="184px"
      show-overflow-tooltip
    />
    <el-table-column
      prop="createName"
      label="入库操作人"
      min-width="128px"
      show-overflow-tooltip
    />
    <el-table-column
      prop="createTime"
      label="入库时间"
      min-width="136px"
      show-overflow-tooltip
    />
    <el-table-column
      prop="num"
      label="入库总数"
      min-width="136px"
      show-overflow-tooltip
    />
    <el-table-column fixed="right" label="操作" align="left" min-width="156px">
      <template #default="{ row }">
        <el-button type="primary" link @click="handleDetail(row)"
          >入库详情</el-button
        >
        <el-button type="primary" link @click="handleEdit(row)">修改</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>
